<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>会员列表-WeAdmin Frame型后台管理系统-WeAdmin 1.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../../static/css/font.css">
    <link rel="stylesheet" href="../../static/css/weadmin.css">
    <link rel="stylesheet" href="../../layui/css/layui.css">


    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <script src="../../static/js/jquery-1.11.1.min.js"></script>
</head>

<body>
<div class="weadmin-nav">
			<span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">用户管理</a>
        <a>
          <cite>用户列表</cite></a>
      </span>
    <a class="layui-btn layui-btn-sm" style="line-height:1.6em;margin-top:3px;float:right"
       href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">&#x1002;</i></a>
</div>
<div class="weadmin-body">

    <div class="demoTable" id="search">
        用户搜索：
        <div class="layui-inline">
            <input name="number" id="number" placeholder="请输入用户编号" autocomplete="off" class="layui-input">
        </div>
        <button class="layui-btn" data-type="reload"><i class="layui-icon">&#xe615;</i></button>
    </div>

    <div class="weadmin-block">
        <!--<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>-->
        <button class="layui-btn" onclick="WeAdminShow('添加资源','./addResource.html',600,500)"><i class="layui-icon"></i>添加
        </button>
    </div>


    <table class="layui-table" id="test" lay-filter="demo">
    </table>

    <!--添加角色form-->
    <!--编辑信息页面-->
    <div id="editForm" style="display: none">
        <form action="" method="post" class="layui-form">
            <div style="height: 20px"></div>
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    资源名称
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="name" name="name" required="" lay-verify="required" autocomplete="off"
                           class="layui-input" >
                </div>
            </div>
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    资源标识
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="permission" name="name" required="" lay-verify="required" autocomplete="off"
                           class="layui-input" >
                </div>
            </div>
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    资源url
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="url" name="name" required="" lay-verify="required" autocomplete="off"
                           class="layui-input" >
                </div>
            </div>

            <div style="height: 20px"></div>
            <div>
                <div class="layui-form-item">
                    <label class="layui-form-label">
                    </label>
                    <button class="layui-btn" lay-filter="update" lay-submit="">确定</button>
                </div>
            </div>
        </form>
    </div>

    <script type="text/html" id="barDemo">

        <a class="layui-icon" lay-event="edit">&#xe642;</a>

        <!--<a onclick="member_stop(this,'10001')" href="javascript:;" class="layui-icon" lay-event="del">&#xe601;</a>-->


        <!--<td class="td-manage">-->
        <a href="javascript:;" lay-event="del" title="启用">
            <i class="layui-icon">&#xe601;</i>
        </a>
        <!--<a href="javascript:;" lay-event="addRole" title="启用">-->
            <!--<i class="layui-icon">&#xe608;</i>-->
        <!--</a>-->

        <!--<a title="编辑" onclick="WeAdminShow('编辑','./roleList.html')" href="javascript:;">-->
        <!--<i class="layui-icon">&#xe642;</i>-->
        <!--</a>-->
        <!--<a title="删除" lay-event="remove"  href="javascript:;">-->
        <!--<i class="layui-icon">&#xe640;</i>-->
        <!--</a>-->
        <!--</td>-->
    </script>


</div>
<!--<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>-->
<script src="../../layui/layui.js" charset="utf-8"></script>
<script src="../../static/js/eleDel.js" type="text/javascript" charset="utf-8"></script>
<script src="../../static/js/common.js" charset="utf-8"></script>

<script>
    $(function () {

        layui.use(['table', 'form', 'jquery', 'util', 'admin', 'layer', 'layedit', 'laydate'], function () {
            var table = layui.table,
                form = layui.form,
                $ = layui.$,
                util = layui.util,
                admin = layui.admin,
                layer = layui.layer,
                layedit = layui.layedit,
                laydate = layui.laydate;


            $.ajax({
                url: remoteUrl+"resource",
                type: "GET",
                contentType: "application/json;charset=utf-8",
                success: function (json) {

                    if (json.result == "") {
                        json.result = {};
                    } else {
                        table.render({
                            elem: '#test'
                            , cols: [[
                                {field: 'id',  title: 'ID', sort: true}
                                ,
                                {field: 'name',  title: '资源名称', sort: true}
                                , {field: 'permission',  title: '资源标识'}
                                , {field: 'url',  title: '资源地址'}
                                , {field: 'createTime',  title: '加入时间'}
                                , {
                                    field: 'status',  title: '状态', templet: function (d) {
                                        if (d.status === 1) {
                                            $(this).find('i').html('&#xe62f;')
                                            return '  <span class="td-status">\n' +
                                                '            <span class="layui-btn layui-btn-normal layui-btn-xs">已启用</span>\n' +
                                                '        </span>'
                                        } else {
                                            return '  <span class="td-status">\n' +
                                                '            <span class="layui-btn layui-btn-disabled layui-btn-normal layui-btn-xs">已禁用</span>\n' +
                                                '        </span>'
                                        }

                                    }
                                }
                                , {
                                    fixed: 'right', align: 'center', toolbar: '#barDemo'
                                }
                            ]]
                            , id: 'demoReload'
                            , data: json.result
                            , page: {
                                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'],
                                curr: 1,
                                groups: 1,
                                first: false,
                                last: false
                            },
                            text: {none: '暂无相关记录！'},
                            even: true
                        });

                        //监听工具条
                        table.on('tool(demo)', function (obj) {

                            var data = obj.data;
                            var data1;
                            var tip = "";
                            if (obj.event === 'del') {
                                if (data.status === 1) {
                                    data1 = {
                                        "id": data.id,
                                        "status": 0
                                    };
                                    tip = "真的禁用吗？"
                                } else {
                                    tip = "真的启用吗？"
                                    data1 = {
                                        "id": data.id,
                                        "status": 1
                                    };
                                }
                                layer.confirm(tip, function (index) {
                                    $.ajax({
                                        url: remoteUrl+"resource/update",
                                        type: "put",
                                        contentType: "application/json;charset=utf-8",
                                        data: JSON.stringify(data1),
                                        success: function (json) {
                                            layer.msg("ok")
                                        }
                                    });


                                });

                            } else if (obj.event === 'edit') {
                                layer.open({
                                    type: 1,
                                    fix: false, //不固定
                                    maxmin: true,
                                    shadeClose: true,
                                    area: [600 + 'px', 500 + 'px'],
                                    shade: 0.4,
                                    title: "编辑",
                                    content: $('#editForm'),
                                    success: function () {

                                        $('#name').val(data.name);
                                        $('#permission').val(data.permission);
                                        $('#url').val(data.url);
                                        //监听提交
                                        form.on('submit(update)', function (dataField) {

                                            var data1 = {
                                                "id": data.id,
                                                "name": $('#name').val(),
                                                "permission": $('#permission').val(),
                                                "url": $('#url').val()
                                            };
                                            $.ajax({
                                                url: remoteUrl+"resource/update",
                                                type: 'put',//method请求方式，get或者post
                                                dataType: 'json',//预期服务器返回的数据类型
                                                contentType: "application/json; charset=utf-8",
                                                data: JSON.stringify(data1),
                                                success: function (res) {//res为相应体,function为回调函数
                                                    if (res.status === 200) {
                                                        layer.alert("编辑成功", {
                                                            icon: 6
                                                        }, function () {
                                                            // 获得frame索引
                                                            var index = parent.layer.getFrameIndex(window.name);
                                                            //关闭当前frame
                                                            parent.layer.close(index);
                                                        });
                                                    } else {
                                                        layer.msg(res.message);
                                                    }
                                                }
                                            });
                                        });
                                    }
                                })
                            } else if (obj.event === "addRole") {
                                layer.open({
                                    type: 1,
                                    fix: false, //不固定
                                    maxmin: true,
                                    shadeClose: true,
                                    area: [600 + 'px', 500 + 'px'],
                                    shade: 0.4,
                                    title: "设置角色",
                                    content: $('#addRoleForm'),
                                    success: function () {
                                        $('#name').val(data.username);
                                        $.ajax({
                                            url: remoteUrl+"role/ownerAndAllRole/" + data.id,
                                            type: 'get',//method请求方式，get或者post
                                            dataType: 'json',//预期服务器返回的数据类型
                                            contentType: "application/json; charset=utf-8",
                                            success: function (res) {//res为相应体,function为回调函数
                                                if (res.status === 200) {
                                                    var resule = res.result;
                                                    var i = 0;
                                                    $('#roles').html("");
                                                    for (i; i < resule.length; i++) {
                                                        var role = resule[i];
                                                        var checkbox = "";
                                                        if (role.owner === true) {
                                                            checkbox = '<input type="checkbox" value="' + role.id + '" name="" title="' + role.role + '" checked>';
                                                        } else {
                                                            checkbox = '<input type="checkbox" value="' + role.id + '" name="' + role.role + '"   title="' + role.role + '">';

                                                        }
                                                        $('#roles').append(checkbox);
                                                    }
                                                    form.render();
                                                } else {
                                                    layer.msg(res.message);
                                                }
                                            }
                                        });


                                        // $('#L_number').val(data.number);
                                        //监听提交
                                        form.on('submit(addRole)', function (dataField) {

                                            var roles=[];
                                            $.each($('input:checkbox:checked'), function () {
                                                roles.push($(this).val());

                                            });

                                            $.ajax({
                                                url: remoteUrl+"user/addRole/" + data.id,
                                                type: 'put',//method请求方式，get或者post
                                                dataType: 'json',//预期服务器返回的数据类型
                                                contentType: "application/json; charset=utf-8",
                                                data: JSON.stringify(roles),
                                                success: function (res) {//res为相应体,function为回调函数
                                                    if (res.status === 200) {

                                                    } else {
                                                        layer.msg(res.message);
                                                    }
                                                }
                                            });


                                        });
                                    }
                                })

                            }


                        });

                    }
                }
            });


//自定义验证规则
            form.verify({
                username: function (value) {
                    if (value.length < 2) {
                        return '姓名最少两个字符';
                    }
                },
                pass: [/(.+){6,12}$/, '密码必须6到12位'],
                repass: function (value) {
                    if ($('#L_pass').val() != $('#L_repass').val()) {
                        return '两次密码不一致';
                    }
                }
            });
            // var number = $('#L_number').val();
            // if (number.length <= 5) {
            //     $('#L_number').attr('lay-verify', 'number');
            //
            // }
            //失去焦点时判断值为空不验证，一旦填写必须验证
            $('input[name="email"]').blur(function () {
                //这里是失去焦点时的事件
                if ($('input[name="email"]').val()) {
                    $('input[name="email"]').attr('lay-verify', 'email');
                } else {
                    $('input[name="email"]').removeAttr('lay-verify');
                }
            });


            /**
             * 搜索
             */
            $('.demoTable .layui-btn').on('click', function () {
                var number = $('#number').val();
                var username = $('#username').val();

                $.ajax({
                    url: remoteUrl+"student/getByUsernameAndNumber?username=" + username + "&number=" + number,
                    type: "GET",
                    contentType: "application/json;charset=utf-8",
                    success: function (json) {

                        if (json.result == "") {
                            json.result = [];
                        } else {

                            table.render({
                                elem: '#test'
                                , cols: [[
                                    {field: 'id', width: 80, title: 'ID', sort: true}
                                    ,
                                    {
                                        field: 'username',
                                        title: '姓名',
                                        width: 80,
                                        edit: 'text',
                                        templet: function (res) {
                                            return '<em>' + res.user.username + '</em>'
                                        }
                                    },
                                    {field: 'sex', width: 80, title: '性别', sort: true}
                                    , {field: 'birthday', width: 80, title: '生日'}
                                    , {field: 'age', title: '年龄', width: 80}
                                    , {
                                        field: 'number',
                                        title: '学号',
                                        width: 100,
                                        edit: 'text',
                                        templet: function (res) {
                                            return '<em>' + res.user.number + '</em>'
                                        }
                                    },
                                    {field: 'phone', width: 115, edit: 'text', title: '手机号'}
                                    , {field: 'email', width: 150, edit: 'text', title: '邮箱'},
                                    {
                                        field: 'name', title: '学院', width: 140, edit: 'text', templet: function (res) {
                                            return '<em>' + res.gradeClass.department.name + '</em>'
                                        }
                                    },
                                    {
                                        field: 'name', title: '班级', width: 100, edit: 'text', templet: function (res) {
                                            return '<em>' + res.gradeClass.name + '</em>'
                                        }
                                    },
                                    {
                                        fixed: 'right', width: 180, align: 'center', toolbar: '#barDemo'
                                    }

                                ]]
                                , data: json.result
                                , page: true
                                , text: {none: '暂无相关记录！'}
                                , even: true
                            });


                        }
                    }
                });


            });

        });
    });


</script>
</body>

</html>